<%@ page contentType="text/html;charset=UTF-8" language="java" %>

<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8">
	<title>发布</title>
	<meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=0">
	<link rel="stylesheet" type="text/css" href="${ctx}/css/mobiscroll/mobiscroll.scroller.css">
	<link rel="stylesheet" type="text/css" href="${ctx}/css/mobiscroll/mobiscroll.scroller.android-ics.css">
	<link rel="stylesheet" type="text/css" href="${ctx}/css/style.css">
</head>
<body>
	<input type="hidden" id="userId" value="${userid}">
	<input type="hidden" id="ownerName" value="${name}">
	<input type="hidden" id=" value="${mobile}">
	<div class="container">
		<div class="page-textarea">
			<textarea name="ownerMessage" class="textarea-release"placeholder="请输入您要发起的任务内容。小时工，杂工，搬运工，推广，活动，拍手观众...提供最准确的信息，您的订单更容易被完成哦~~" id="textarea"></textarea>
		</div>
		<div class="gouda_cells">			
			<div class="gouda_cell gouda_cell_warn">
	            <div class="gouda_cell_hd"><label for="" class="gouda_label">联系电话</label></div>
	            <div class="gouda_cell_primary">
	                <input class="gouda_input" type="telephone" value="" placeholder="请输入手机号"  id="phone">
	            </div>
	        </div>

	        <div class="gouda_cell gouda_cell_warn">
	            <div class="gouda_cell_hd"><label for="" class="gouda_label">服务开始时间</label></div>
	            <div class="gouda_cell_bd gouda_cell_primary">
	                <input name="serverStartTime" class="gouda_input" type="text" value=""id="svctime" placeholder="服务开始时间">
	            </div>
	        </div>
		</div>
		<div class="willing-pay">
			<div class="">
				<span>愿付酬劳</span>
				<span id="yPprice"class="fr">¥<em id="serverReword">6</em></span>
			</div>
			<div id="barMain">
				<div id="bar">
					<div id="price">
						<ul>
							<li class="fl">6元</li>
							<li class="fr">100元</li>
						</ul>
					</div>
					<div id="thumb">¥</div>
					<div id="bubble">
						<div id="deliverFee">6</div>
					</div>
				</div>
			</div>
		</div>
		<p class="gouda_cells_tips">举个栗子：李先生在小区附近开了家小店，希望找个小时工，下午帮他在小区内发传单，他用“物业小时工”下了订单，小工哥接单后帮他认证的发完了传单，李先生很满意。</div>
		<div class="gouda_btn_area fixed ">
			<a href="javascript:" class="gouda_btn gouda_btn_primary" id="js-release-btn">发布</a>
		</div>
	</div>
	<div class="gouda_mark">
		发布成功
	</div>
	<script src="${ctx}/js/jquery.min.js"></script>
	<script src="${ctx}/js/jquery.cookie.js"></script>
	<script type="text/javascript">
	$(function(){
		$(function() {
			var t, e, i, n, o, r, s, a, u, l, c, d, h, p, f, g;
			l = 30, 
			u = $("#bar").offset().left, 
			g = $("#thumb").width() / 2, 
			h = l - g, 
			s = $("#bar").width() - l - g, 
			p = (s - h) / 7, 
			i = !1, 
			d = 6, 
			c =100, 
			e = function(t) {
				var e;
				return e = t - g - u, h > e ? e = h : e > s && (e = s), e
			}, 
			t = function(t) {
				var e;
				return e = (c - d) / (s - h) * (t - h) + d, Math.round(e)
			}, 
			o = function() {
				$(document).bind("touchmove", n), $(document).bind("touchend", r)
			}, 
			n = function(i) {
				var n;
				i.preventDefault(), 
				n = e(i.originalEvent.touches[0].clientX), 
				$("#thumb").css({
					left: n + "px"
				}), 
				$("#bubble").css({
					left: n - 5 + "px"
				}), 
				$("#bubble").children().first().html(t(n)),
				$('#yPprice').find('em').html(t(n))

			}, 
			r = function() {
				$(document).unbind("touchmove", n), $(document).unbind("touchend", r), $.cookie("deliverFee", $("#deliverFee").html())
			}, 
			f = function(i) {
				var n;
				n = e(i.originalEvent.touches[0].clientX), $("#thumb").css({
					left: n + "px"
				}), $("#bubble").css({
					left: n - 5 + "px"
				}), $("#bubble").children().first().html(t(n)), $.cookie("deliverFee", $("#deliverFee").html())
			}, 
			$("#bubble").children().first().html(d), $.cookie("deliverFee", d), a = h;
			$("#thumb").css({
				left: a + "px"
			}), 
			$("#bubble").css({
				left: a - 5 + "px"
			}), 
			$("#thumb").bind("touchstart", o), $("#bubble").bind("touchstart", o), $("#bar").bind("touchstart", f)
		}) 
	})
	</script>
	<script src="${ctx}/css/mobiscroll/mobiscroll.zepto.js" type="text/javascript"></script>
	<script src="${ctx}/css/mobiscroll/mobiscroll.core.js" type="text/javascript"></script>
	<script src="${ctx}/css/mobiscroll/mobiscroll.scroller.js" type="text/javascript"></script>
	<script src="${ctx}/css/mobiscroll/mobiscroll.datetime.js" type="text/javascript"></script>
	<script src="${ctx}/css/mobiscroll/mobiscroll.scroller.android-ics.js" type="text/javascript"></script>
	<script src="${ctx}/css/mobiscroll/mobiscroll.i18n.zh.js" type="text/javascript"></script>
	<script type="text/javascript">
	    var keyword = 'project_cleaning';
	    var city = '北京';
		(function(a) {
	    var b = {weekText: ["周日", "周一", "周二", "周三", "周四", "周五", "周六"],daysCount: 15};
	    a.mobiscroll.presets.datehour = function(p) {
	        var v = a.extend({}, p.settings), x = a.extend(p.settings, b, v), t = a(this);
	        var l = new Date();
	        var o = [];
	        var e = {label: "日期",keys: [],values: []};
	        var w = {label: "时间",keys: [],values: []};
	        for (var k = 0; k < x.daysCount; k++) {
	            var j = l.valueOf();
	            j = j + k * 24 * 60 * 60 * 1000;
	            j = new Date(j);
	            var u = j.getFullYear();
	            var g = j.getMonth() + 1;
	            var r = j.getDate();
	            var f = g + "月" + r + "日&nbsp;" + x.weekText[j.getDay()];
	            if (g <= 9) {
	                g = "0" + g
	            }
	            if (r <= 9) {
	                r = "0" + r
	            }
	            var q = u + "-" + g + "-" + r;
	            e.keys.push(q);
	            if (k == 0) {
	                f = "今天"
	            } else {
	                if (k == 1) {
	                    f = "明天"
	                }
	            }
	            e.values.push(f)
	        }
	        for (var n = 0; n <= 23; n++) {
	            if (n <= 9) {
	                n = "0" + n
	            }
	            w.keys.push(n + ":00",n+":30");
	        }
	        for(var i = 0; i<w.keys.length; i++){
	            w.values.push(w.keys[i])
	        }        
	        var c = [];
	        c.push(e);
	        c.push(w);
	        o.push(c);
	        return {wheels: o,parseValue: function(I, D) {
	                // console.info("parseValue:" + I);
	                var B = new RegExp(/[0-9]{4}-[0-9]{2}-[0-9]{2}[" "]{1}[0-9]{2}[:]{1}[0-9]{2}/);
	                if (I == null || I == "" || !B.test(I)) {
	                    var H = new Date();
	                    var C = H.getHours();
	                    var s = H.getMinutes();
	                    if (C >= 0 && C < 8 || (C == 8 && s == 0)) {
	                        C = 10
	                    } else {
	                        if (C >= 8 && C < 17 || (C == 17 && s == 0)) {
	                            if (s == 0) {
	                                C = C + 2
	                            } else {
	                                C = C + 3
	                            }
	                        } else {
	                            H = H.valueOf();
	                            H = H + 24 * 60 * 60 * 1000;
	                            H = new Date(H);
	                            C = 10
	                        }
	                    }
	                    if (C > 19) {
	                        C = 19
	                    }
	                    var G = H.getFullYear();
	                    var z = H.getMonth() + 1;
	                    var F = H.getDate();
	                    z = z <= 9 ? "0" + z : z;
	                    F = F <= 9 ? "0" + F : F;
	                    C = C <= 9 ? "0" + C : C;
	                    I = G + "-" + z + "-" + F + " " + C + ":00";
	                    // console.info("defaultValue:" + I)
	                }
	                var h = I.split(" "), E = [], A = 0, J;
	                a.each(D.settings.wheels, function(i, d) {
	                    a.each(d, function(y, m) {
	                        m = m.values ? m : convert(m);
	                        J = m.keys || m.values;
	                        if (a.inArray(h[A], J) !== -1) {
	                            E.push(h[A])
	                        } else {
	                            E.push(J[0])
	                        }
	                        A++
	                    })
	                });
	                return E
	            },validate: function(C, I) {
	                var N = new Date();
	                var s = N.getHours();
				    s=s+1;
	                var h = N.getMinutes();
	                var B = N.getFullYear();
	                var G = N.getMonth() + 1;
	                var K = N.getDate();
	                G = G <= 9 ? "0" + G : G;
	                K = K <= 9 ? "0" + K : K;
	                s = s <= 9 ? "0" + s : s;
	                var E = B + "-" + G + "-" + K;
	                var L = a(".dw-ul", C).eq(0);
	                var D = a(".dw-ul", C).eq(1);
	                var O = a(".dw-li", L).index(a('.dw-li[data-val="' + E + '"]', L)), M = a(".dw-li", L).size();
	                a(".dw-li", L).removeClass("dw-v").slice(O, M).addClass("dw-v");
	                var A = s + ":00", z = "23:30";
	                var J = p.temp;
	                if (J[0] != E) {
	                    A = "00:00"
	                } else {
	                    if (N.getHours() > 20 || (N.getHours() == 20 && h > 0)) {
	                        if(keyword == "project_cleaning" && city == "北京"){
	                            A = "12:00";
	                        }else{
	                            A = "10:00";
	                        }
	                    }
	                }
	                var H = a(".dw-li", D).index(a('.dw-li[data-val="' + A + '"]', D)), F = a(".dw-li", D).index(a('.dw-li[data-val="' + z + '"]', D));
	                a(".dw-li", D).removeClass("dw-v").slice(H, F + 1).addClass("dw-v")
	            }}
	    };
	    a.mobiscroll.presetShort("datehour")
	})(jQuery);
	</script>
	<script type="text/javascript">
		$(function () {
			var dateScroll = function(){
				var date = new Date();
				var curr = new Date().getFullYear(),
					d = date.getDate(),
					m = date.getMonth();
				$('#svctime').scroller('destroy').scroller({
					preset: 'datehour',
					minDate: new Date(curr, m, d, 8, 00),
					maxDate: new Date(curr, m, d+7),
					invalid: [{ d: new Date(), start: '00:00', end: (date.getHours()+2)+':'+date.getMinutes() }],
					theme: "android-ics light",
					mode: "scroller",
					lang: 'zh',
					display:"bottom",
					animate: "slideup",
					stepMinute: 30,
					dateOrder: 'MMDdd',
					timeWheels: 'HHii',
					rows:3
				});
			}
			dateScroll();//时间选择控件
		});



		// 添加js
		$('#js-release-btn').on('click',this,function(){
			var $this = $(this);
			if($this.hasClass('gouda_btn_disabled')){
				return false;
			}

			var textareaVal = $('#textarea').val();
			if(!textareaVal){
				validate('error','请填写任务！');
				return false;
			}
			if(textareaVal.length>150){
				validate('error','字数过多！');
				return false;
			}
			if(!isPhone($('#phone').val())){				
				validate('error','手机号错误！');
				$('#phone').focus();
				return false;
			}
			var svctime = $('#svctime').val();
			if(!svctime){
				validate('error','请填写时间！');
				return false;
			}


			// 点击按钮后 按钮为不可点击状态
			$(this).addClass('gouda_btn_disabled');


			var url = "${ctx}/temp/orders-save.do";
			var userId = $("#userId").val();
			var ownerMessage = $("#textarea").val();
			var ownerPhone = $("#phone").val();
			var serverStartTime = $("#svctime").val();
			var serverReword = $("#serverReword").text();
			var ownerName = $("#ownerName").val();

			var param = {
				ownerId:userId,
				ownerMessage:ownerMessage,
				ownerPhone:ownerPhone,
				serverStartTime:serverStartTime,
				serverReword:serverReword,
				ownerName:ownerName
			};
			$.post(url,param,function(res){
				if(res.success == "1") {
					validate('success','发布成功！');
					$(this).removeClass('gouda_btn_disabled');
					WeixinJSBridge.call('closeWindow');
				}else {
					validate('error','发布失败！');
					$(this).removeClass('gouda_btn_disabled');
				}
			},"json");

			/*
			$.ajax({
			    type: 'get',
			    url:'http://wwww.bad',
			    data: {
			    },
			    success: function (msg) {
			    	validate('success','发布成功！');
			    	return false;
			    },
			    error:function(){
			    	$(this).removeClass('gouda_btn_disabled');
			    }
			})
*/
		})


		function validate(className,text,callback){
			$('.gouda_mark').html(text).addClass('active '+className);
			setTimeout(function(){
				$('.gouda_mark').removeClass('active').removeClass(className);
				callback && callback();
			},3000);
		}
		function isPhone(aPhone) {
		    var bValidate = RegExp(/^(0|86|17951)?(13[0-9]|15[012356789]|18[0-9]|14[57])[0-9]{8}$/).test(aPhone);
		    return bValidate;
		}


		function doSave(){
			var url = "${ctx}/temp/orders-save.do";
			var userId = $("#userId").val();
			var ownerMessage = $("#textarea").val();
			var ownerPhone = $("#phone").val();
			var serverStartTime = $("#svctime").val();
			var serverReword = $("#serverReword").text();

			var param = {
				userId:userId,
				ownerMessage:ownerMessage,
				ownerPhone:ownerPhone,
				serverStartTime:serverStartTime,
				serverReword:serverReword
			};
			$.post(url,param,function(res){
				if(res.success == "1") {
					alert("提交成功");
				}else {
					alert("提交失败");
				}
			},"json")
		}
	</script>
</body>
</html>